<template>
    <div class="imageWall clear">
        <img class="background" src="../../assets/images/common/imageWall/22.jpg"/>
        <div class="container">
            <div class="cb clear">
                <img class="hexagon hj" src="../../assets/images/common/imageWall/多边形-1.png" />
                <img class="hexagon" src="../../assets/images/common/imageWall/组-1.png" />
                <img class="hexagon" src="../../assets/images/common/imageWall/组-2.png" />
                <img class="hexagon hj" src="../../assets/images/common/imageWall/多边形-1.png" />
                <img class="hexagon" src="../../assets/images/common/imageWall/组3.png" />
                <img class="hexagon" src="../../assets/images/common/imageWall/组4.png" />
                <img class="hexagon hj" src="../../assets/images/common/imageWall/多边形-1.png" />
                <img class="hexagon" src="../../assets/images/common/imageWall/组5.png" />
                <img class="hexagon" src="../../assets/images/common/imageWall/组6.png" />
                <img class="hexagon" src="../../assets/images/common/imageWall/组7.png" />
                <img class="hexagon hj" src="../../assets/images/common/imageWall/多边形-1.png" />
                <img class="hexagon" src="../../assets/images/common/imageWall/组8.png" />
                <img class="hexagon hj" src="../../assets/images/common/imageWall/多边形-1.png" />
            </div>
        </div>
    </div>
</template>
<script>
    import '../../assets/css/bundle.css'

    export default {
        ready(){
            let i = 1, mm = 12, nn = 0;
            $('.imageWall .container .hexagon').each(function () {
                if (i % 4 === 0) {
                    mm = 12;
                } else if (i % 4 === 3) {
                    mm = 12;
                } else {
                    mm = 7;
                }

                if (i % 2 === 0) {
                    $(this).css({
                        'top': mm + 10 + 'em',
                        'margin-left': ($(this).hasClass('hj') ? nn + 1 : nn) + 'em'
                    });
                } else {
                    nn += 6;
                    $(this).css({
                        'top': mm + 'em',
                        'margin-left': ($(this).hasClass('hj') ? nn + 1 : nn) + 'em'
                    });
                }
                i++;
            });
        },
        methods: {},
        data(){
            return {}
        }
    }
</script>
<style>
    .cb{

    }
</style>